<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
        <title>动态表单设计</title>  
        <script src="${cdnAddress}/js/boot.js" type="text/javascript"></script>   
        <script type="text/javascript" charset="utf-8" src="${scripts}/tabledefine/ueditor/ueditor-fd-config.js"></script>  
        <script type="text/javascript" charset="utf-8" src="${scripts}/tabledefine/ueditor/ueditor-fd.all.js"> </script>  
        <script type="text/javascript" charset="utf-8" src="${scripts}/tabledefine/ueditor/lang/zh-cn/zh-cn.js"></script>
        <script type="text/javascript" charset="utf-8" src="${scripts}/tabledefine/ueditor/form-design/design-plugin.js"></script>             
 </head>
   <style type="text/css">
    body{
        margin:0;padding:0;border:0;width:100%;height:100%;overflow:hidden;
    }    
    </style>
   
<body> 
<input type="hidden" id="projectName" value="${projectName}" /> 
 <div id="layout1" class="mini-layout" style="width:100%;height:100%;"  borderStyle="border:solid 1px #aaa;">
    <div title="" region="north" height="80" showSplitIcon="true" >
		   <a class="mini-button" iconCls="icon-attachement" plain="true" onclick="yulan()">预览</a>
		   <a class="mini-button" iconCls="icon-save" plain="true" onclick="saveToDB()">保存</a>     
		   <a class="mini-button" iconCls="icon-upload" plain="true" onclick="deploy()">发布</a>     
   </div> 
    <div title="所有控件" showProxyText="true" region="west" width="200" expanded="true" showSplitIcon="true">
      <div id="toolsDiv" style="padding:0px;width:10%;float:left;width:140px;overflow:auto;">  
            <c:forEach items ="${controlWidgetList}" var="item">
		        <a class="mini-button" style="width:auto;" iconCls="${item.icon}" plain="true" onclick="designer.execCommand('${item.htmlName}')">${item.controlName}</a>
			</c:forEach> 
         </div>
    </div>
    <div title="center" region="center" style="width:100%;height:100%;"  >
         <script id="designer" type="text/plain" style="width:100%;">${dto.htmlCode}</script>
    </div>
</div>
       <form id="form1" method="post">
        <input class="mini-hidden" id="id" name="id" value="${dto.id}" />
        <input class="mini-hidden" id="categoryId" name="categoryId" value="${dto.categoryId}" />
        <input class="mini-hidden" id="categoryName" name="categoryName" value="${dto.categoryName}"/>
        <input class="mini-hidden" id="tableName" name="tableName" value="${dto.tableName}"/>
        <input class="mini-hidden" id="dymcformId" name="dymcformId" value="${dto.dymcformId}"/>
        <input class="mini-hidden" id="dymcformName" name="dymcformName" value="${dto.dymcformName}" />
        <input class="mini-hidden" id="status" name="status" value="${dto.status}"/>
        <input class="mini-hidden" id="htmlCode" name="htmlCode" value=''/>
        <input class="mini-hidden" id="isDeployed" name="isDeployed" value='${dto.isDeployed}'/>
    </form>    
      
    <script type="text/javascript">
    var projectName = $("#projectName").val();
    var hei=document.body.clientHeight;
    $(document).ready(function(){
        $("#designer").css("height",(hei-150)+"px");
    	});
    
   function saveToDB(){
	   var isDeployed = mini.get("isDeployed").getValue();
	   if(isDeployed==1){
		   mini.alert("表单已经发布,不能再修改");
		   return;
	   }
    	 var form = new mini.Form("form1");
    	save("",projectName,form);
    }
    <c:forEach items ="${controlWidgetList}" var="item">
	  UE.plugins['${item.htmlName}'] = function () {  
        var me = this,thePlugins = '${item.htmlName}';  
        me.commands[thePlugins] = {  
            execCommand:function () {  
                var dialog = new UE.ui.Dialog({  
                    iframeUrl:this.options.UEDITOR_HOME_URL + UE.FormDesignBaseUrl+'/config/<c:if test="${item.isCustom=='0'}">controlwidget.html?controlId=${item.controlId}&projectName=${projectName}&htmlName=${item.htmlName}</c:if><c:if test="${item.isCustom=='1'}">${item.htmlName}.html?controlId=${item.controlId}&projectName=${projectName}&htmlName=${item.htmlName}</c:if>',  
                    name:thePlugins,  
                    editor:this,  
                    title: '${item.controlName}',  
                    cssRules:"width:${item.controlWindWidth};height:${item.controlWindHeight};",  
                    buttons:[  
                    {  
                        className:'edui-okbutton',  
                        label:'确定',  
                        onclick:function () {  
                            dialog.close(true);  
                        }  
                    },  
                    {  
                        className:'edui-cancelbutton',  
                        label:'取消',  
                        onclick:function () {  
                            dialog.close(false);  
                        }  
                    }]  
                });  
                dialog.render();  
                dialog.open();  
            }  
        };  
        var popup = new baidu.editor.ui.Popup({  
            editor:this,  
            content: '',  
            className: 'edui-bubble',  
            _edittext: function () {  
                  baidu.editor.plugins[thePlugins].editdom = popup.anchorEl;  
                  me.execCommand(thePlugins);  
                  this.hide();  
            },  
            _delete:function(){  
                if( window.confirm('确认删除该控件吗？') ) {  
                    baidu.editor.dom.domUtils.remove(this.anchorEl,false);  
                }  
                this.hide();  
            }  
        } );  
        popup.render();  
        me.addListener( 'mouseover', function( t, evt ) {  
        	addListenerWithControl(t, evt,thePlugins,"${item.controlName}",popup);
        });  
    };
    </c:forEach>    
     var designer = UE.getEditor('designer'); 
     function yulan(){
    	 	mini.open({
    	        url:projectName+"/DymcformDisplayAdmin/getFormPage?dymcformId=${dto.dymcformId}",
    	        title: "预览", 
    	        allowResize: true,       //允许尺寸调节
        	    allowDrag: true,         //允许拖拽位置
        	    showCloseButton: true,   //显示关闭按钮
        	    showMaxButton: true,     //显示最大化按钮
        	    showModal: true,         //显示遮罩
    	    });
     }
     // 发布(生成表格)
   	function deploy(){
   	 var isDeployed = mini.get("isDeployed").getValue();
	   if(isDeployed==1){
 		   mini.alert("表单已经发布,不能再修改");
 		   return;
 	   }
   	 var form = new mini.Form("form1");
   		generateTable("",projectName,form);
   	}
    </script> 
</body>  
</html>  